
import React, { Component,useState,useEffect } from 'react'
import servicePage from '../config/apiUrl'
//使用antd的24个横向布局
import '../static/style/components/header.css'
import {List,Comment} from 'antd'
import axios from 'axios'
import moment from 'moment'

function LastMessage(props){
    const[list,setList] = useState([])
    useEffect(()=>{
        getList()
        console.log(props)
    },[])
    const getList=()=>{
        axios({
            method:'get',
            url:servicePage.getMessageById+props.props,
            withCredentials:true
        }).then(
            res=>{
                setList(res.data.list)
            }
        )
    }
    return (
        <div>
            <div className='endNote'>-------一共有 {list.length} 条留言～------</div>
            <List
                className="comment-list"
                itemLayout="horizontal"
                dataSource={list}
                renderItem={item => (
                <li>
                    <Comment
                    author={item.leaveName}
                    content={item.leaveMessage}
                    datetime={moment(item.time,'YYYYMMDDHHmmss').format("评论于YYYY年MM月DD日 HH:mm:ss")}
                    />
                </li>
                )}
            />
        </div>
    )

 }
 export default LastMessage